<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <meta property="qc:admins" content="6525276424516367" />
    <meta property="wb:webmaster" content="ce8327d47982a584" />

    <title>慕图素材</title>

    <link rel="stylesheet" href="/static/lib/bootstrap/css/bootstrap.css">
    <link rel="stylesheet" href="/static/schema/default/css/base.css">
    <link href="/static/schema/default/css/dashboard.css" rel="stylesheet">
    <script src="/static/lib/jquery/jquery-2.1.3.min.js"></script>

   
</head>
<body>
    <nav class="navbar navbar-inverse navbar-fixed-top">
        <div class="container-fluid">
            <div id="navbar" class="navbar-collapse collapse row">
                <div class="col-sm-offset-1">
                    <ul class="nav navbar-nav">
                        <li >
                            <a href="/">首页</a>
                        </li>
                        <li >
                            <a href="/auth/index">登录</a>
                        </li>
                        <li >
                            <a href="/auth/logout">退出</a>
                        </li>
                        <li >
                            <a href="/resource/upload/index">上传资源</a>
                        </li>
                         <li >
                            <a href="/resource/matter/create/index">创建素材</a>
                        </li>
                        <li >
                            <a href="/resource/matter/manage/index">素材管理</a>
                        </li>
                       
                        <li >
                            <a href="/resource/binder/manage/index">收藏夹管理</a>
                        </li>
                    </ul>
                </div>
            </div>
        </div>
    </nav>
    <div class="container-fluid">
        <div class="row">
            <div class="col-sm-6 col-sm-offset-2 alertDiv" id="notice_messages"></div>
        </div>
    </div>
    <div class="container-fluid">
        <div class="row">
            <div class="col-sm-10 col-sm-offset-1 main">
                <form action="" method="post" id="matterForm" class="form-horizontal" for="ala_ocr"enctype="multipart/form-data">
                        <div class="form-group">
                                <label class="control-label col-sm-1" for="flag">类型：</label>
                                <div class="controls col-sm-4">
                                    <label class="radio-inline">
                                        <input type="radio" name="matterType" value="327681" checked="checked">灵感图</label>
                                    <label class="radio-inline">
                                        <input type="radio" name="matterType" value="327682">psd</label>
                                    
                                    
                                </div>
                            </div>
                        <div class="form-group">
                            <label class="control-label col-sm-1" for="cats">分类：</label>
                            <div class="controls col-sm-7">
                                {{ range .cats }}
                                <label>
                                    <input type="radio" name="cats" value="{{ .Id }}">  
                                        {{ .Name }} 
                                 </label>
                                 {{ end }}
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="control-label col-sm-1" for="tags">标签：</label>
                            <div class="controls col-sm-7">
                                {{ range .tags }}
                                <label>
                                    <input type="checkbox" name="tags" value="{{ .Id }}">  
                                        {{ .Name }} 
                                 </label>
                                 {{ end }}
                            </div>
                        </div>
                    <div id="picDiv">
                        <div class="form-group">
                            <label class="control-label col-sm-1" for="pics">灵感图：</label>
                            <div class="controls col-sm-4">
                                <select class="form-control" for="pics">
                                    <option value="">---请选择---</option>
                                {{ range .pics }}
                                    {{ if not .UsedBy }}
                                        <option value="{{ .Uuid }}">{{ .Fname }}</option>
                                    {{ end }}
                                {{ end }}
                                 </select>
                            </div>
                            <div class="controls col-sm-7">
                                <table class="table table-striped table-hover text-left" for="pics">
                                    <tbody id="fsUploadProgress">
                                        {{ range .pics }}
                                        <tr id="{{ .Uuid }}" class="progressContainer" style="opacity: 1; display:none;" >
                                            <td class="progressName">
                                                {{ .Fname }}
                                                <div class="Wrapper">
                                                    <div class="imgWrapper col-md-4">
                                                        <a class="linkWrapper" target="_blank" href="{{ .Link }}" title="查看原图">
                                                            <img src="{{ .Link }}?imageView2/1/w/200/h/200"></a>
                                                    </div>
                                                </div>
                                            </td>
                                            <td class="progressFileSize">
                                                    <div class="infoWrapper col-md-8">
                                                        <div>
                                                            <div>格式：<span class="origin-format">{{ .Mime }}</span></div>
                                                            <div>宽度：<span class="orgin-width">{{ .Width }}px</span></div>
                                                            <div>高度：<span class="origin-height">{{ .Height }}px</span></div>
                                                            <div>大小：<span class="origin-height">{{ .Size }}kb</span></div>
                                                            <div>上传时间：<span class="origin-height">{{ .CreateAt }}</span></div>
                                                            <div>Hash：<span class="origin-height">{{ .Hash }}</span></div>
                                                        </div>
                                                    </div>
                                            </td>
                                        </tr>
                                        {{ end }}
                                    </tbody>
                                    </table>
                                
                            </div>
                        </div>
                    </div>
                    <div id="psdDiv" style="display:none;">
                        <div class="form-group">
                            <label class="control-label col-sm-1" for="shows">展示图：</label>
                            <div class="controls col-sm-4">
                                <select class="form-control" for="shows">
                                    <option value="">---请选择---</option>
                                {{ range .shows}}
                                    {{ if not .UsedBy }}
                                       <option value="{{ .Uuid }}">{{ .Fname }}</option>
                                    {{ end }}
                                {{ end }}
                                 </select>
                            </div>
                            <div class="controls col-sm-7">
                                <table class="table table-striped table-hover text-left" for="shows">
                                    <tbody id="fsUploadProgress">
                                        {{ range .shows }}
                                        <tr id="{{ .Uuid }}" class="progressContainer" style="opacity: 1; display:none;" >
                                            <td class="progressName">
                                                {{ .Fname }}
                                                <div class="Wrapper">
                                                    <div class="imgWrapper col-md-4">
                                                        <a class="linkWrapper" target="_blank" href="{{ .Link }}" title="查看原图">
                                                            <img src="{{ .Link }}?imageView2/1/w/200/h/200"></a>
                                                    </div>
                                                </div>
                                            </td>
                                            <td class="progressFileSize">
                                                    <div class="infoWrapper col-md-8">
                                                        <div>
                                                            <div>格式：<span class="origin-format">{{ .Mime }}</span></div>
                                                            <div>宽度：<span class="orgin-width">{{ .Width }}px</span></div>
                                                            <div>高度：<span class="origin-height">{{ .Height }}px</span></div>
                                                            <div>大小：<span class="origin-height">{{ .Size }}kb</span></div>
                                                            <div>上传时间：<span class="origin-height">{{ .CreateAt }}</span></div>
                                                            <div>Hash：<span class="origin-height">{{ .Hash }}</span></div>
                                                        </div>
                                                    </div>
                                            </td>
                                        </tr>
                                        {{ end }}
                                    </tbody>
                                    </table>
                                
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="control-label col-sm-1" for="psds">psd：</label>
                            <div class="controls col-sm-4">
                                <select class="form-control" for="psds">
                                    <option value="">---请选择---</option>
                                {{ range .psds}}
                                    {{ if not .UsedBy }}
                                   <option value="{{ .Uuid }}">{{ .Fname }}</option>
                                    {{ end }}
                                 {{ end }}
                                 </select>
                            </div>
                            <div class="controls col-sm-7">
                                <table class="table table-striped table-hover text-left" for="psds">
                                    <tbody id="fsUploadProgress">
                                        {{ range .psds}}
                                        <tr id="{{ .Uuid }}" class="progressContainer" style="opacity: 1; display:none;" >
                                            <td class="progressName">
                                                {{ .Fname }}
                                                <div class="Wrapper">
                                                    <div class="imgWrapper col-md-4">
                                                        <a class="linkWrapper" target="_blank" href="{{ .Link }}" title="查看原图">
                                                            <img src="/static/default.png"></a>
                                                    </div>
                                                </div>
                                            </td>
                                            <td class="progressFileSize">
                                                    <div class="infoWrapper col-md-8">
                                                        <div>
                                                            <div>格式：<span class="origin-format">{{ .Mime }}</span></div>
                                                            <div>宽度：<span class="orgin-width">{{ .Width }}px</span></div>
                                                            <div>高度：<span class="origin-height">{{ .Height }}px</span></div>
                                                            <div>大小：<span class="origin-height">{{ .Size }}kb</span></div>
                                                            <div>上传时间：<span class="origin-height">{{ .CreateAt }}</span></div>
                                                            <div>Hash：<span class="origin-height">{{ .Hash }}</span></div>
                                                        </div>
                                                    </div>
                                            </td>
                                        </tr>
                                        {{ end }}
                                    </tbody>
                                    </table>
                                
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="control-label col-sm-1" for="title">积分：</label>
                            <div class="controls col-sm-4">
                                <input class="form-control" name="score" type="text" value=""></div>
                        </div>
                    </div>
                        <div class="form-group">
                            <label class="control-label col-sm-1" for="title">标题：</label>
                            <div class="controls col-sm-4">
                                <input class="form-control" name="title" type="text" value=""></div>
                        </div>
                        <div class="form-group">
                            <label class="control-label col-sm-1" for="desc">描述：</label>
                            <div class="controls col-sm-4">
                            <textarea name="desc" class="form-control" rows="10"></textarea>    
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="control-label col-sm-1" for="address"></label>
                            <button class="btn btn-primary" onclick="createMatter()" type="button">创建</button>
                        </div>

                    </form>
                </div>

            </div>
        </div>
    </div>


<script type="text/javascript">
    $(function() {

    $("#matterForm [name='matterType']").bind('change', function(){
        var flag = $("#matterForm [name='matterType']:checked").val();
        if (flag == "327681"){
            $("#picDiv").show();
            $("#psdDiv").hide();
        }else{
            $("#picDiv").hide();
            $("#psdDiv").show();
        }
    });

        $("select[for]").bind("change", function(){
            var flag = $(this).attr("for");
            var id = $(this).val();

            $("table[for='" + flag +  "'] tr").hide();
            if(id != ""){
                $("#" + id).show();
            }
        });
        $("div.radio[for]").hover(function(){
            var id = $(this).attr("for");
            $("#" + id).show();
        }, function(){
            var id = $(this).attr("for");
            $("#" + id).hide();
        });


    });

    function createMatter(){
        var flag = $("#matterForm [name='matterType']:checked").val();
        var cat = $("#matterForm [name='cats']:checked").val();
        var tags = "";
        $("#matterForm [name='tags']:checked").each(function(){
            tags += $(this).val() + ",";
        });

        var pic = $("#matterForm select[for='pics']").val();
        var show = $("#matterForm select[for='shows']").val();
        var psd = $("#matterForm select[for='psds']").val();
        var score = $("#matterForm [name='score']").val();
        var title = $("#matterForm [name='title']").val();
        var desc = $("#matterForm textarea[name='desc']").val();
        
        var data = {
            "flag": flag,
            "categroy": cat,
            "tags": tags,
            "pic": pic,
            "show": show,
            "psd": psd,
            "score": score,
            "title": title,
            "desc": desc,
        }
        var url = "/resource/matter/create";
        $.post(url, data, function(body){
            res = body;
            if (res.ok) {
                alert("创建成功");
            }else {
                alert(res.msg);
            }
        });
        /*
        $.ajax({
            type: 'POST',
            url: url,
            data: data,
            dataType: txt,
            success: function(body){
                alert(body);
            },
            error: function(e ){
                alert("ajax网络错误，" + e);
            },
            dataType: dataType
        });
        */
        
    }
</script>

</body>
</html>
